$(function () {
    // 时间过滤器
    template.defaults.imports.dateFormat = function (dtStr) {

        let dt = new Date(dtStr);
        let y = dt.getFullYear();
        let m = padZero(dt.getMonth() + 1)
        let d = padZero(dt.getDate())

        let hh = padZero(dt.getHours())
        let mm = padZero(dt.getMinutes())
        let ss = padZero(dt.getSeconds())
        return `${y}-${m}-${d} ${hh}:${mm}:${ss}`
    };
    // 个位补零
    function padZero(n) {
        return n > 9 ? n : '0' + n
    }

    // 定义查询参数
    let q = {

        pagenum: 1,   //是	int	页码值
        pagesize: 3, //是	int	每页显示多少条数据
        cate_id: "",  //否	string	文章分类的 Id
        state: "",    //否	string	文章的状态，可选值有：已发布、草稿
    }

    // 2.渲染页面
    let layer = layui.layer
    initTable();

    function initTable() {
        $.ajax({
            method: "GET",
            url: '/my/article/list',
            data: q,
            success: function (res) {
                // console.log(res)
                if (res.status != 0) {
                    return layer.msg(res.message)
                }
                // 成功后渲染(传递对象，使用属性)
                let htmlStr = template('tpl-table', { data: res.data });
                $("tbody").html(htmlStr)
                // 调用分页
                renderPage(res.total);
            }

        });
    }

    // 3.初始化文章分类
    let form = layui.form
    initCate();
    function initCate() {
        $.ajax({
            url: '/my/article/cates',
            success: function (res) {
                // console.log(res)
                if (res.status != 0) {
                    console.log(res)
                    return layer.msg(res.message)
                }
                // 成功渲染
                let htmlstr = template('tpl-cate', res);
                // console.log(res);
                $("[name=cate_id]").html(htmlstr)
                form.render()
            }

        })
    }

    // 4.筛选
    $("#form-search").on('submit', function (e) {
        // 阻止默认提交
        e.preventDefault();
        // 修改参数
        let cate_id = $("[name=cate_id]").val();
        let state = $("[name=state]").val();
        q.cate_id = cate_id;
        q.state = state;
        // 调用方法
        initTable();
    })


    // 5.分页

    function renderPage(total) {
        let laypage = layui.laypage;

        laypage.render({
            elem: 'pageBox', //注意，这里的 pageBox/ test1 是 ID，不用加 # 号
            count: total,//数据总数，从服务端得到
            limit: q.pagesize,
            curr: q.pagenum,
            // 
            layout: ['count', 'limit', 'prev', 'page', 'next', 'skip'],
            limits: [2, 3, 4, 5],
            jump: function (obj, first) {
                //obj包含了当前分页的所有参数，比如：
                // console.log(obj.curr); 得到当前页，以便向服务端请求对应页的数据。
                // console.log(obj.limit); 得到每页显示的条数
                // 改变当前页
                q.pagenum = obj.curr;
                q.pagesize = obj.limit;

                //首次不执行
                if (!first) {
                    initTable()
                }
            }
        });
    }

    // 6.删除
    $("tbody").on('click', '.btn-delete', function () {
        let layer = layui.layer;

        let Id = $(this).attr("data-id")
        layer.confirm('是否删除？', { icon: 3, title: '提示' }, function () {

            $.ajax({
                method: 'GET',
                url: '/my/article/delete/' + Id,
                success: function (res) {
                    // console.log(res)
                    if (res.status != 0) {
                        return layer.msg(res.message)
                    }

                    layer.msg('删除成功')
                    if ($(".btn-delete").length == 1 && q.pagenum > 1) {
                        q.pagenum--
                    }
                    initTable();
                }
            })
            layer.close(index)
        })
    })


});